起源
我們的故事不傳奇，來自一個小團隊的成立，沒有資本、沒有資源、沒有高手，兩年前的我，以 iOS 開發的角色，剛剛加入這間剛成立、剛轉型的公司，沒有敏捷開發、沒有 CI/CD、沒有 Cloud 的觀念，土法煉鋼，本地超英趕美，接近隕石式開發。

幾週前我們發佈了我們對於 DevOps 文化的養成與建立，今天要跟大家分享我們建立 UX 流程與思維的過程與心得，理論與實踐總有一條鴻溝，但我們還是必須先走一步。

目標是強化需求與最終體驗的流程（基於 Lean UX），並且透過理論引導實踐，希望對於正在閱讀的你們有些幫助。

另外關於文內的製作的細節應該有許多優質可靠的文章可以參考了，因為本身並不是 Designer，所以應該沒辦法給大家太多製作細節的建議，今天就會主要從大框架、思路來討論。

—

系統功能分析與規劃

系統功能分析與規劃大約會有幾個比較重要的事情要執行，產品定位、產品策略規劃、功能資訊架構規劃

通常這邊我們也會讓整個團隊都參與，透過頭腦風暴的方式進行，其實團隊中每個角色看每個功能都會有不同視角的，可以提取大家有價值的部分，提煉成這個產品或項目的精華。

下圖是系統功能分析架構的示例
(img)

到此就暫時完成了前期研究的部分，這部分觸碰到核心的需求，這階段做得越扎實，後面會感覺收益越大。接下來要進入 Wireframe 的設計。

Wireflow 出版與設計

Wireframe 設計階段，最主要的目的是圖像化流程與需求的具象化，不僅僅可以讓客戶更確認需求，也可以讓團隊小伙伴對於這個專案與產品的需求更加理解，也可以開始做頂層設計。這邊我們大概會有三個部分，分別是User flow、Wireframe、Wireflow

根據項目的大小與嚴謹度，不一定會三份都產出，可能會全部整合成 Wireflow，一方面給客戶確認，一方面也給內部小夥伴確認畫面與動線邏輯，作為之後開發的邏輯規則依據。

Wireflow 示例，會包含頁面上的邏輯與動線
(img)

互動文件設計

互動文件設計目的通常是讓上面的畫面在開發前可以真正的先動起來，不僅僅對於客戶或使用者提出的需求更加確認外，也可以讓團隊、相關人員先體驗產品或專案動起來的感覺。大概有幾個重點項目要做，製作 Prototyping 、易用性測試，調整設計（根據反饋與總結調整或修改流程或操作，並且更新 Wireflow）

這階段通常是一個循環的，即使到了開發期間，發現流程與邏輯需要調整，也會回來執行調整設計，然後再看 UI 是否需要接著調整。

這邊團隊還會算是融合傳統 System Analysis 的步驟，把這些需求與流程動線整理出來。

總結

今天跟大家分析了最主要的兩個情境「UX」與「互動文件設計」，明天開始會跟大家分享 UI/UX 與 Develop 結合的資訊，讓我們再期待一下吧！